<template>
	<view class="">
		<ly-tree 
			:tree-data="navTree"
			:props="defaultProps" 
			ref="tree" 
			node-key="node_id" 
			show-radio 
			check-on-click-node
			check-only-leaf
			showNodeIcon
			:default-checked-keys="checkedKeys"
			@check="handleCheck"
			@radio-change="handleRadioChange"
			@node-click="handleNodeClick" />
	</view>
</template>

<script>
	import LyTree from "../ly-tree/ly-tree.vue"
	export default{
		components:{LyTree},
		props:{
			treeData:{
				type:Array,
				default:()=>[],
				required:true
			}
		},
		data(){
			return{
				navTree:[],
				checkedKeys:[],
				defaultProps:{
					label:'roomName',
					children:'children',
					icon: 'icon'
					
				}
			}
		},
		methods:{
			handleCheck(obj){
				console.log("check obj",obj);
				this.$emit('defaultCheckKey',obj.checkedKeys)
				this.$emit('checkObj',obj)
			},
			// 只要节点的选中状态改变就触发（包括设置默认选中，点击选中/取消选中），会被触发多次
			handleRadioChange(obj) {
				
			},
			
			handleNodeClick(obj) {
				
			}
		},
		mounted(){
			this.navTree = this.treeData
			this.checkedKeys = this.$store.state.defaultNavKey;
		}
	}
</script>

<style scoped>
	
</style>
